<template>
  <div class="pre-archive-detail">
    <el-dialog width="70%" :visible.sync="formShow" @close="handleClickDeal('cancel')" v-dialog-drag :modal-append-to-body="false" :close-on-click-modal="false" :lock-scroll="false" :append-to-body="true">
      <span slot="title">
        <i class="iconfont icon-ziliao"></i>
        <span>{{ title }}</span>
      </span>

      <div class="WholeScroll" style="max-height: 650px; overflow: auto;padding: 0 15px;">
        <el-tabs v-model="activeName" @tab-click="handleClick">
          <el-tab-pane label="项目信息" name="first"></el-tab-pane>
        </el-tabs>

        <el-form :model="formBaseData" ref="formBaseData" class="small-lineHeight-form" :rules="formBaseRules" style="position: relative" v-show="activeName == 'first'">
          <el-row>
            <el-col :span="24">
              <el-col :span="24">
                <el-form-item label="项目名称" prop="proName" :label-width="formlabelWidth">
                  <el-input class="contract-ele-long" v-model="formBaseData.proName" placeholder="项目名称" :disabled="detailType === 'check'"></el-input>
                </el-form-item>
              </el-col>
            </el-col>
          </el-row>

          <el-row>
            <el-col :span="24">
              <el-col :span="12">
                <el-form-item label="项目代码" prop="code" :label-width="formlabelWidth">
                  <el-input class="contract-ele" v-model="formBaseData.code" placeholder :disabled="detailType === 'check'"></el-input>
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item label="项目简称" prop="shortName" :label-width="formlabelWidth">
                  <el-input class="contract-ele" v-model="formBaseData.shortName" placeholder :disabled="detailType === 'check'"></el-input>
                </el-form-item>
              </el-col>
            </el-col>
          </el-row>

          <el-row>
            <el-col :span="24">
              <el-col :span="12">
                <el-form-item label="项目类型" required prop="projectType" :label-width="formlabelWidth">
                  <el-select class="contract-ele" v-model="formBaseData.projectType" filterable placeholder="请选择" :disabled="detailType === 'check'">
                    <el-option v-for="(item, i) in selectList.projectType" :key="i" :label="item.label" :value="item.value"></el-option>
                  </el-select>
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item label="当前阶段" prop="phase" :label-width="formlabelWidth">
                  <el-select class="contract-ele" @change="$forceUpdate()" v-model="formBaseData.phase" filterable placeholder="请选择" :disabled="detailType === 'check'">
                    <el-option v-for="(item, i) in selectList.phaseOptions" :key="i" :label="item.label" :value="item.value"></el-option>
                  </el-select>
                </el-form-item>
              </el-col>
            </el-col>
          </el-row>

          <el-row>
            <el-col :span="24">
              <el-col :span="12">
                <el-form-item label="项目性质" prop="projectNature" :label-width="formlabelWidth">
                  <el-select class="contract-ele" v-model="formBaseData.projectNature" filterable placeholder="请选择" :disabled="detailType === 'check'">
                    <el-option v-for="(item, i) in selectList.projectNature" :key="i" :label="item.label" :value="item.value"></el-option>
                  </el-select>
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item label="建设单位" prop="constructionUnit" :label-width="formlabelWidth">
                  <el-select class="contract-ele" v-model="formBaseData.constructionUnit" filterable placeholder="请选择" :disabled="detailType === 'check'" @change="getLinkUserOpts">
                    <el-option v-for="(item, i) in selectList.companyList" :key="i" :label="item.fullname" :value="item.id"></el-option>
                  </el-select>
                </el-form-item>
              </el-col>
            </el-col>
          </el-row>

          <el-row>
            <el-col :span="24">
              <el-col :span="12">
                <el-form-item label="投资模式" prop="manageForm" :label-width="formlabelWidth">
                  <el-select class="contract-ele" v-model="formBaseData.manageForm" filterable placeholder="请选择" :disabled="detailType === 'check'" @change="manageFormChange">
                    <el-option v-for="(item, i) in selectList.manageForm" :key="i" :label="item.label" :value="item.value"></el-option>
                  </el-select>
                </el-form-item>
              </el-col>
            </el-col>
          </el-row>

          <el-row>
            <el-col :span="24">
              <el-col :span="12" class="noBreakcol" v-if="formBaseData.measureType == '2'">
                <el-form-item class="noBreak" label="" prop="isBuildSharesOneList" :label-width="formlabelWidth">
                  <span slot="label" class="formStar">
                    <span class="formStar">施工单位是否共用一套清单</span>
                  </span>
                  <el-select class="contract-ele" v-model="formBaseData.isBuildSharesOneList" filterable placeholder="请选择" :disabled="detailType === 'check'">
                    <el-option v-for="(item, i) in selectList.isBuildSharesOneListList" :key="i" :label="item.name" :value="item.id"></el-option>
                  </el-select>
                </el-form-item>
              </el-col>
            </el-col>
          </el-row>

          <el-row>
            <el-col :span="24">
              <el-form-item label="项目相关人" prop="linkUsers" :label-width="formlabelWidth">
                <cmsPopoverTree :defaultProps="defaultProps" ref="cmsPopoverTree" :data="linkUserOpts" :selectVal="checkedLinkUsers" type="multi" @addMulTag="addMulTag" :defaultIds="defaultIds" @delTag="delTag" @addTag="addTag" :disabled="
                  detailType === 'check' || formBaseData.constructionUnit == ''
                " />
              </el-form-item>
            </el-col>
          </el-row>

          <el-row>
            <el-col :span="24">
              <el-col :span="12">
                <el-form-item label="计划开工日期" prop="startPlanTime" :label-width="formlabelWidth">
                  <el-date-picker style="width: 95%" v-model="formBaseData.startPlanTime" type="date" value-format="yyyy-MM-dd" placeholder="选择日期" :disabled="detailType === 'check'"></el-date-picker>
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item label="实际开工日期" prop="startTime" :label-width="formlabelWidth">
                  <el-date-picker style="width: 95%" v-model="formBaseData.startTime" type="date" value-format="yyyy-MM-dd" placeholder="选择日期" :disabled="detailType === 'check'"></el-date-picker>
                </el-form-item>
              </el-col>
            </el-col>
          </el-row>

          <el-row>
            <el-col :span="24">
              <el-col :span="12">
                <el-form-item label="计划竣工日期" prop="endPalnTime" :label-width="formlabelWidth">
                  <el-date-picker style="width: 95%" v-model="formBaseData.endPalnTime" type="date" value-format="yyyy-MM-dd" placeholder="选择日期" :disabled="detailType === 'check'"></el-date-picker>
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item label="实际竣工日期" prop="endTime" :label-width="formlabelWidth">
                  <el-date-picker style="width: 95%" v-model="formBaseData.endTime" type="date" value-format="yyyy-MM-dd" placeholder="选择日期" :disabled="detailType === 'check'"></el-date-picker>
                </el-form-item>
              </el-col>
            </el-col>
          </el-row>

          <el-row>
            <el-col :span="24">
              <el-col :span="12">
                <el-form-item label="总投资" prop="amount" :label-width="formlabelWidth">
                  <el-input class="contract-ele" v-model="formBaseData.amount" @blur="blurInputEvent" type="number" @keydown.native="$publicJs.changeInputLimit" :disabled="detailType === 'check'">
                    <template slot="append">万元</template>
                  </el-input>
                </el-form-item>
              </el-col>
            </el-col>
          </el-row>

          <el-row>
            <el-col :span="24">
              <el-form-item label="项目地址" prop="projectLocation" :label-width="formlabelWidth">
                <el-input class="contract-ele-long" v-model="formBaseData.projectLocation" placeholder="请输入项目地址" :disabled="detailType === 'check'"></el-input>
              </el-form-item>
            </el-col>
          </el-row>

          <el-row>
            <el-col :span="24" style="position: relative">
              <el-form-item label="项目概况" prop="projectSurvey" :label-width="formlabelWidth">
                <el-input class="contract-ele-long" v-model="formBaseData.projectSurvey" placeholder rows="8" type="textarea" :disabled="detailType === 'check'"></el-input>
              </el-form-item>
            </el-col>
          </el-row>

          <!--          <el-row>-->
          <!--            <el-col :span="24" style="position: relative">-->
          <!--              <el-form-item label="项目意义" prop="projectMeaning" :label-width="formlabelWidth">-->
          <!--                <el-input class="contract-ele-long" v-model="formBaseData.projectMeaning" placeholder rows="8" type="textarea" :disabled="detailType === 'check'"></el-input>-->
          <!--              </el-form-item>-->
          <!--            </el-col>-->
          <!--          </el-row>-->
          <el-row>
            <el-col :span="24" style="position: relative">
              <el-form-item label="建设规模" prop="buildScale" :label-width="formlabelWidth">
                <el-input class="contract-ele-long" v-model="formBaseData.buildScale" placeholder rows="8" type="textarea" :disabled="detailType === 'check'"></el-input>
              </el-form-item>
            </el-col>
          </el-row>
          <!--          <el-row>-->
          <!--            <el-col :span="24" style="position: relative">-->
          <!--              <el-form-item label="建设模式" prop="buildMode" :label-width="formlabelWidth">-->
          <!--                <el-input class="contract-ele-long" v-model="formBaseData.buildMode" placeholder rows="8" type="textarea" :disabled="detailType === 'check'"></el-input>-->
          <!--              </el-form-item>-->
          <!--            </el-col>-->
          <!--          </el-row>-->
          <!--          <el-row>-->
          <!--            <el-col :span="24" style="position: relative">-->
          <!--              <el-form-item label="资金来源" prop="fundsSource" :label-width="formlabelWidth">-->
          <!--                <el-input class="contract-ele-long" v-model="formBaseData.fundsSource" placeholder rows="8" type="textarea" :disabled="detailType === 'check'"></el-input>-->
          <!--              </el-form-item>-->
          <!--            </el-col>-->
          <!--          </el-row>-->
          <el-row>
            <el-col :span="24">
              <el-form-item label="项目效果图" :label-width="formlabelWidth">
                <cmsUploadFileView ref="fileOne" :detail-id="detailId" :fileSystem="fileSystem['one']" :fileList="fileList" :disabled="detailType === 'check'|| detailType === 'audit'" type="mul" info="支持上传 png/jpg/jpeg 文件" :detail-type="detailType" />
              </el-form-item>
            </el-col>
          </el-row>

          <!--          <el-row>-->
          <!--            <el-col :span="24">-->
          <!--              <el-form-item label="附件" :label-width="formlabelWidth">-->
          <!--                <cmsUploadFile ref="filetwo" :detail-id="detailId" :fileSystem="fileSystem['two']" :fileList="fileList_file" :disabled="detailType === 'check'|| detailType === 'audit'" type="mul" info="支持上传 png/jpg/gif/doc/xlsx/ppt/pdf 文件" :detail-type="detailType" />-->
          <!--              </el-form-item>-->
          <!--            </el-col>-->
          <!--          </el-row>-->

          <el-col :span="24" v-if="detailType === 'check'">
            <div class="formTitle">参建单位信息</div>
            <el-table ref="table" :header-cell-style="{
                textAlign: 'center',
                padding: '8px 0',
                backgroundColor: '#f2f2f2',
                borderColor: '#d4d4d4',
              }" :cell-style="{
                padding: '6px 0',
                textAlign: 'center',
                borderColor: '#d4d4d4',
              }" border style="width: 98%; margin-bottom: 30px; margin-top: 10px" :data="sectionTable">
              <el-table-column prop="code" label="施工标段" min-width="220"></el-table-column>
              <el-table-column prop="buildUnit" label="施工单位" min-width="200"></el-table-column>
              <el-table-column prop="supervisorUnit" label="监理单位" min-width="200"></el-table-column>
            </el-table>
          </el-col>
        </el-form>
      </div>

      <div slot="footer" class="dialog-footer">
        <!--api操作按钮 除去上报-->
        <!--新建和编辑的暂存上报-->
        <template v-if="detailType === 'build' || detailType === 'edit'">
          <loading-button size="small" type="primary" @click="handleClickDeal('submit', { flag: 1 }, $event)">
            <span><i class="iconfont icon-icon_save"></i> 确 定</span>
          </loading-button>
        </template>
        <el-button size="small" @click="handleClickDeal('cancel')">
          <i class="iconfont icon-icon_cancel"></i> 取 消
        </el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>
import cmsPopoverTree from '@/views/components/cmsPopoverTree.vue'
import crudDict from '@/api/system/dict'
import crudProject from '@/api/buss/project'
import msgUtil from '@/utils/msgUtil'
import dept from '@/api/system/dept'
import crudSection from '@/api/buss/sectionInfo'
import LoadingButton from '@/components/LoadingButton';
const PREVIEW_URL = process.env.VUE_APP_FILE_PREVIEW
import { v4 as uuidv4 } from 'uuid';

// import canvasResize from 'canvas-resize'
export default {
  name: 'info-detail',
  components: {
    cmsPopoverTree,
    LoadingButton,
    // contractDetail: require('../../../contract/contract-payment/contract-payment-detail/contract-payment-detail')
    //   .default
  },
  props: {
    postDetail: {
      type: Object,
      default: {
        show: false,
        type: 'build',
        params: {},
      },
    },
  },
  watch: {
    postDetail(value) {
      this.initData();
      // 显示详情弹窗
      this.formShow = value.show
      // 初始化窗口参数
      this.activeName = 'first'
      // 详情类型
      this.detailType = value.type
      this.detailId = value.detailId ? value.detailId : '';
      if (this.detailType == 'build') {
        this.$set(this, 'fileList', [])
        this.$set(this, 'fileList_file', [])
        //默认显示直管
        this.formBaseDataBiao.properties =
          this.selectList.propertiesFieldOptions[0].value
        //清空formBaseData的数据
        //
        this.formBaseDataBiao.buildUnitUsers = ''
        this.formBaseDataBiao.agentConstructionUsers = ''
        this.formBaseDataBiao.costUnitUsers = ''
        this.formBaseDataBiao.supervisorUnitUsers = ''
        //this.formBaseDataBiao.properties='';
        //
        this.title = '新增'
      } else if (this.detailType == 'check') {
        this.title = '查看项目详情'
      } else if (this.detailType == 'edit') {
        this.title = '编辑'
      } else {
        this.title = ''
      }
      this.chooseProjectTypeArr = []
      this.checkedLinkUsers = []
      if (this.detailType !== 'build') {
        // // 获取详情请求
        this.getDetail()
        // this.getRegionList()
        this.getSectionList()
      }
      this.setTable();
    },
  },
  data() {
    return {
      videoUrl: '',
      chooseIndex: 0,
      leftBridge: [],
      cjUnitTable: [],
      mainProjectSizeTable: [],
      moneyStatusTable: [],
      mainTecTable: [],
      leftArr: [{
        name: '参建单位'
      }, {
        name: '主要工程量'
      }, {
        name: '费用情况（万元）'
      }, {
        name: '主要技术指标'
      }],
      chooseLeftIndex: 0,
      defaultIds: [],
      //
      companyMap: {
        build: {},
        cost: {},
        supervisor: {},
        agent: {},
      },
      detailBiaoId: '', //该值专门用于存放标段信息的id值
      total: '',
      tendersTotal: '',
      buildList: [],
      supervisorList: [],
      costList: [],
      agentList: [],
      //end
      cascaderProps: {
        multiple: true,
        value: 'id',
        label: 'name',
        expandTrigger: 'hover',
        emitPath: false,
      },
      uploadLoading: false,
      tenders: false,
      tendersFen: false,
      biaoInformation: '',
      uploadLoading2: false,
      uploadLoading3: false,
      linkUsers: {},
      ownerRepresentativeUsers: {},
      checkedLinkUsers: [],
      checkedownerRepresentativeUsers: [],
      linkUserOpts: [],
      ownerRepresentativeUserOpts: [],
      defaultProps: {
        children: 'children',
        label: 'name',
      },
      isPopContainer: false,
      isShowVideo: false,
      videoFlag: false,
      //是否显示进度条
      videoUploadPercent: '',
      //进度条的进度，
      isShowUploadVideo: false,
      //显示上传按钮
      videoForm: {
        showVideoPath: '',
      },
      isLoading: false,
      detailType: 'build', // 详情类型 build新建 check不可编辑查看 edit编辑
      detailId: '', // 当前详情的id
      detailActions: [], // 当前详情的操作项
      formShow: false, // 表单展示
      formlabelWidth: '163px', // 表单左侧标题宽度
      formlabelWidth1: '30px', // 表单左侧标题宽度
      formlabelWidth2: '150px', // 表单左侧标题宽度
      title: '档案详情',
      activeName: 'first',
      isAudit: '',
      fileList: [],
      fileList_file: [],
      fileSystem: {
        'one': {
          sys: 'buss',
          module: 'info',
          part: 'one',
          compoName: 'fileOne'
        },
        // 'two': {
        //   sys: 'buss',
        //   module: 'info',
        //   part: 'two',
        //   compoName: 'filetwo'
        // },
        // 'three': {
        //   sys: 'buss',
        //   module: 'info',
        //   part: 'three',
        //   compoName: 'filethree'
        // },
        // 'four': {
        //   sys: 'buss',
        //   module: 'info',
        //   part: 'four',
        //   compoName: 'filefour'
        // },
        // 'five': {
        //   sys: 'buss',
        //   module: 'info',
        //   part: 'five',
        //   compoName: 'filefive'
        // },
        // 'six': {
        //   sys: 'buss',
        //   module: 'info',
        //   part: 'six',
        //   compoName: 'filesix'
        // },
        // 'seven': {
        //   sys: 'buss',
        //   module: 'info',
        //   part: 'seven',
        //   compoName: 'fileseven'
        // },
      },
      selectList: {
        surveyList: [],
        designList: [],
        manageForm: [],
        projectNature: [],
        sectorCompanyList: [],
        measureTypeList: [
          { id: '1', name: "分项清单计量" },
          { id: '2', name: "清单计量" },
        ],
        isBuildSharesOneListList: [
          { id: '1', name: "是" },
          { id: '0', name: "否" },
        ],

        civilMeaReportList: [
          { id: '1', name: "只需承包商报表" },
          { id: '2', name: "施工单位报表及承包商汇总表" },
        ],
        manageList: [
          {
            label: '项目办',
            value: 1,
          },
          {
            label: '指挥部',
            value: 2,
          },
        ],
        needCharge: [
          {
            label: '是',
            value: 1,
          },
          {
            label: '否',
            value: 2,
          },
        ],
        authorizeList: [
          {
            label: '是',
            value: 1,
          },
          {
            label: '否',
            value: 2,
          },
        ],
        typeOptions: [
          {
            label: '项目类型',
            value: '',
          },
        ],
        regionOptions: [],
        phaseOptions: [],
        projectType: [],
        gradeType: [],
        companyList: [],
        propertiesFieldOptions: [
          {
            label: '属性',
            value: '',
          },
        ],
        file: [],
      }, // 所有下拉框列表的集合
      formBaseData: {
        measureType: '',
        isBuildSharesOneList: '',
        civilMeaReport: '',
        lineNum: '',
        needCharge: '',
        gradeType: '',
        projectNature: '',
        sectorCompany: '',
        manageForm: '',
        proName: '',
        code: '',
        unitCode: '',
        shortName: '',
        projectType: '',
        phase: '',
        constructionUnit: '',
        ownerRepresentative: '',
        startTime: '',
        endTime: '',
        //start
        buildUnitUsers: [],
        supervisorUnitUsers: [],
        costUnitUsers: [],
        agentConstructionUsers: [],
        startPlanTime: '',
        endPalnTime: '',
        projectMeaning: '',
        biaoInformation: '',
        buildCom: '',
        supervisorCom: '',
        costCom: '',
        properties: '',
        agentConstructionCom: '',
        //end
        amount: '',
        region: '',
        projectLocation: '',
        projectSurvey: '',
        picture: {
          show: false,
          url: '',
        },
        video: {
          show: false,
          url: '',
        },
        regionIdList: [],
        hugeBridgeLong: '',
        hugeBridgeNum: '',
        bigBridgeLong: '',
        bigBridgeNum: '',
        shortBridgeLong: '',
        shortBridgeNum: '',
        hugeTunnelLong: '',
        hugeTunnelNum: '',
        longTunnelLong: '',
        longTunnelNum: '',
        shortTunnelLong: '',
        shortTunnelNum: '',
        buildScale: '',
        buildMode: '',
        fundsSource: '',
        projectFirstLetter: '',
      }, // 表单基本信息内容

      formBaseDataBiao: {
        code: '',
        coveredArea: '',
        projectSite: '',
        structureType: '',
        startTime: '',
        endTime: '',
        buildUnitUsers: [],
        supervisorUnitUsers: [],
        costUnitUsers: [],
        agentConstructionUsers: [],
        properties: '',
        intro: '',
        //新增兩個
        buildUnit: '',
        supervisorUnit: '',
        //end
        // manufacturingCost:'',
        sectionLength: '',
      },

      formBaseRules: {
        projectNature: [
          {
            required: true,
            message: '请选择项目性质',
            trigger: 'blur',
          },
        ],
        code: [
          {
            required: true,
            message: '请输入项目代码',
            trigger: 'blur',
          },
        ],
        projectFirstLetter: [
          {
            required: true,
            message: '请输入项目名英文首字母大写',
            trigger: 'blur',
          },
        ],
        buildScale: [
          {
            required: true,
            message: '请输入建设规模',
            trigger: 'blur',
          },
        ],
        buildMode: [
          {
            required: true,
            message: '请输入建设模式',
            trigger: 'blur',
          },
        ],
        fundsSource: [
          {
            required: true,
            message: '请输入资金来源',
            trigger: 'blur',
          },
        ],
        manageForm: [
          {
            required: true,
            message: '请选择管理模式',
            trigger: 'blur',
          },
        ],
        sectorCompany: [
          {
            required: true,
            message: '请选择板块公司',
            trigger: 'change',
          },
        ],
        proName: [
          {
            required: true,
            message: '请输入项目名称',
            trigger: 'blur',
          },
        ],
        shortName: [
          {
            required: true,
            message: '请输入项目简称',
            trigger: 'blur',
          },
        ],
        projectType: [
          {
            required: true,
            message: '请选择项目类型',
            trigger: 'blur',
          },
        ],
        projectType: [
          {
            required: true,
            message: '请输入项目类型',
            trigger: 'blur',
          },
        ],
        phase: [
          {
            required: true,
            message: '请输入当前阶段',
            trigger: 'blur',
          },
        ],
        constructionUnit: [
          {
            required: true,
            message: '请输入建设单位',
            trigger: 'blur',
          },
        ],
        // startTime: [{
        //   required: true,
        //   message: '请选择开工日期',
        //   trigger: 'blur'
        // }],
        //新增4个必填项
        buildUnitUsers: [
          {
            required: true,
            message: '请输入施工单位',
            trigger: 'blur',
          },
        ],
        supervisorUnitUsers: [
          {
            required: true,
            message: '请输入监理单位',
            trigger: 'blur',
          },
        ],
        properties: [
          {
            required: true,
            message: '请输入项目属性',
            trigger: 'blur',
          },
        ],
        agentConstructionUnitUsers: [
          {
            required: true,
            message: '请输入代理单位',
            trigger: 'blur',
          },
        ],
        //end
        amount: [
          {
            required: true,
            message: '请输入总投资',
            trigger: 'blur',
          },
        ],
        regionIdList: [
          {
            required: true,
            message: '请选择所属区域',
            trigger: 'blur',
          },
        ],
        projectSurvey: [
          {
            required: true,
            message: '请输入项目概况',
            trigger: 'blur',
          },
        ],
        measureType: [
          {
            required: true,
            message: '请选择计量类型',
            trigger: 'blur',
          },

        ],
        isBuildSharesOneList: [{
          required: true,
          message: '请选择施工单位是否共用一套清单',
          trigger: 'blur',
        },],

        civilMeaReport: [{
          required: true,
          message: '请选择土建计量报表',
          trigger: 'blur',
        },],

      }, // 表单基本信息验证
      /**
       * 审批配置数据
       * */
      auditConfigData: {
        //  实体基本数据
        baseData: {},
        //  基本请求地址
        urlBase: '',
        //  是否显示
        show: false,
        //  提交数据成功时候的回调函数
        submitCallBack: null,
        //  选择了动作时的回调函数
        selActionCallBack: null,
      },
      contractDetail_postDetailData: {
        show: false,
        type: 'check',
      },
      fileFormTitle: '',
      fileListShow_file: [
        {
          name: '12312',
        },
      ],
      sectionTable: [],
      secondTable: [],
      secondTableSearch: {
        pageIndex: 0,
        pageSize: 10,
        pageSum: 0,
      },
      search: {
        pageIndex: 0,
        pageSize: 10,
        pageSum: 0,
      },
      thirdTableSearch: {
        pageIndex: 0,
        pageSize: 10,
        pageSum: 0,
      },
      thirdTable: [],
      fileList_fujian: [],
      fileList_img: [],
      fileList_video: [],
      // fileList_zongtu: [],
      fileListShow_fujian: [],
      fileListShow_img: [],

      fileList_zongtu_PDF: [],
      fileListShow_zongtu_PDF: [],
      fileList_zongtu_CAD: [],
      fileListShow_zongtu_CAD: [],
      projectTypeTreedata: [], //项目类型 下拉数据
      chooseProjectTypeArr: [],
    }
  },
  mounted() {
    // this.getLinkUserOptss()
    // this.getProperties()
    // this.cjUnitTable:[],
    //   mainProjectSizeTable:[],
    //   moneyStatusTable:[],
    //   mainTecTable:[],
  },
  methods: {
    blurInputEvent() {
      if (this.formBaseData.amount) {
        this.formBaseData.amount = Number(this.formBaseData.amount)
      }
    },
    newUpNumber() {
      var obj = event.target;
      var t = obj.value.charAt(0);
      obj.value = obj.value.replace(".", "$#$")//把第一个字符'.'替换成'$#$'
        .replace(/\./g, "")//把其余的字符'.'替换为空
        .replace("$#$", ".")//把字符'$#$'替换回原来的'.'
        .replace(/[^\d.]/g, "")//只能输入数字和'.'
        .replace(/^\./g, "")//不能以'.'开头
      if (t == '-') {
        obj.value = '-' + obj.value;
      }
    },
    uploadFunction(item, row) {
      console.log(this.$refs.uploadFunctionRef)
      this.$refs.uploadFunctionRef.submit()
    },
    changeMeasureType(val) {
      if (val == '1') {
        this.formBaseData.isBuildSharesOneList = ''
      }
    },
    addMeasureBatch() {
      let arr = {
        leftName: '新增项目',
        type: '0',
        name: '',
        content: '',
        fileObj: {
          fileList: []
        }
      }
      this.leftBridge.push(arr)
    },
    uuid() {
      return uuidv4().split('-')[0]
    },
    uploadFile(file, row) {
      console.log(file, row)
      //配置一下上传的参数
      this.$publicUpload.uploadFile(
        file,
        this.uuid(),
        'designEstimate',
        'file1',
        file.name,
      ).then(res => {
        //成功的回调，往row里面塞fileName
        if (!row.fileList) {
          row.fileList = []
        }
        let arr = JSON.parse(JSON.stringify(row.fileList))
        arr = [{
          name: file.name,
          size: file.size,
          id: res.data[0],
          isLoading: false,
        }]
        this.$set(row, 'fileList', arr)
        this.$forceUpdate()
        console.log(row.fileList, 'row.fileListrow.fileListrow.fileListrow.fileList')
      }).catch(res => {

      })
    },
    removeFile(file, fileList) {
      this.$confirm('确定是否删除？', '提示', {
        confirmButtonClass: 'iconfont icon-icon_ok',
        cancelButtonClass: 'iconfont icon-icon_cancel',
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'info'
      })
        .then(() => {
          fileList.forEach((item, index) => {
            if (file.id === item.id) {
              fileList.splice(index, 1)
            }
          })
          this.$publicUpload.removeFile(file.id)
        })
        .catch(() => {
        })
    },
    deleteLeftBridge(index) {
      this.$confirm('确定是否删除？', '提示', {
        confirmButtonClass: 'iconfont icon-icon_ok',
        cancelButtonClass: 'iconfont icon-icon_cancel',
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'info'
      })
        .then(() => {
          if (this.leftBridge.length == 1) {
            this.$set(this, 'leftBridge', [])
          } else {
            this.leftBridge.splice(index, 1)
            let arr = JSON.parse(JSON.stringify(this.leftBridge))
            this.$set(this, 'leftBridge', arr)
            this.chooseIndex = 0
          }

        })
        .catch(() => {
        })
    },
    changeLeftName(item) {
      item.leftName = item.name
    },
    setTable() {
      let arr = [{ companyType: '主要设计单位', companyName: '', indexNum: 0 }, { companyType: '施工单位', companyName: '', indexNum: 1 }, { companyType: '监理单位', companyName: '', indexNum: 2 }]
      this.$set(this, 'cjUnitTable', arr)
      let arr2 = [{ name: '路基土石方', unit: '', designQuantity: '', completeQuantity: '', indexNum: 0 },
      { name: '填方压实', unit: '', designQuantity: '', completeQuantity: '', indexNum: 1 },
      { name: '路基排水工程', unit: '', designQuantity: '', completeQuantity: '', indexNum: 2 },
      { name: '路基防护工程', unit: '', designQuantity: '', completeQuantity: '', indexNum: 3 },
      { name: '路面工程', unit: '', designQuantity: '', completeQuantity: '', indexNum: 4 },
      { name: '特大桥', unit: '', designQuantity: '', completeQuantity: '', indexNum: 5 },
      { name: '大桥', unit: '', designQuantity: '', completeQuantity: '', indexNum: 6 },
      { name: '中、小桥', unit: '', designQuantity: '', completeQuantity: '', indexNum: 7 },
      { name: '涵洞', unit: '', designQuantity: '', completeQuantity: '', indexNum: 8 },
      { name: '隧道', unit: '', designQuantity: '', completeQuantity: '', indexNum: 9 },
      { name: '互通式立体交叉', unit: '', designQuantity: '', completeQuantity: '', indexNum: 10 },
      { name: '分离式立体交叉', unit: '', designQuantity: '', completeQuantity: '', indexNum: 11 },
      { name: '平面交叉道', unit: '', designQuantity: '', completeQuantity: '', indexNum: 12 },
      { name: '通道', unit: '', designQuantity: '', completeQuantity: '', indexNum: 13 },
      { name: '人行天桥', unit: '', designQuantity: '', completeQuantity: '', indexNum: 14 }]
      this.$set(this, 'mainProjectSizeTable', arr2)

      let arr3 = [{ name: '第一部分 建筑安装工程费用', budgetEstimate: '', finalAccounts: '', fluctuateNum: '', indexNum: 0 },
      { name: '路基工程', budgetEstimate: '', finalAccounts: '', fluctuateNum: '', indexNum: 1 },
      { name: '路面工程', budgetEstimate: '', finalAccounts: '', fluctuateNum: '', indexNum: 2 },
      { name: '桥梁涵洞工程', budgetEstimate: '', finalAccounts: '', fluctuateNum: '', indexNum: 3 },
      { name: '交叉工程', budgetEstimate: '', finalAccounts: '', fluctuateNum: '', indexNum: 4 },
      { name: '隧道工程', budgetEstimate: '', finalAccounts: '', fluctuateNum: '', indexNum: 5 },
      { name: '其它工程及沿线设施', budgetEstimate: '', finalAccounts: '', fluctuateNum: '', indexNum: 6 },
      { name: '临时工程', budgetEstimate: '', finalAccounts: '', fluctuateNum: '', indexNum: 7 },
      { name: '管理养护及服务房屋', budgetEstimate: '', finalAccounts: '', fluctuateNum: '', indexNum: 8 },
      { name: '绿化及环境保护', budgetEstimate: '', finalAccounts: '', fluctuateNum: '', indexNum: 9 },
      { name: '专项管理费', budgetEstimate: '', finalAccounts: '', fluctuateNum: '', indexNum: 10 },
      { name: '建安费预留费用(其他支付)', budgetEstimate: '', finalAccounts: '', fluctuateNum: '', indexNum: 11 },
      { name: '第二部分 设备、工具及器具购置费', budgetEstimate: '', finalAccounts: '', fluctuateNum: '', indexNum: 12 },
      { name: '第三部分 工程建设其他费用', budgetEstimate: '', finalAccounts: '', fluctuateNum: '', indexNum: 13 },
      { name: '第一、二、三部分合计', budgetEstimate: '', finalAccounts: '', fluctuateNum: '', indexNum: 14 }]
      this.$set(this, 'moneyStatusTable', arr3)

      let arr4 = [{ indicatorName: '公路等级', indicatorContent: '', indexNum: 0 },
      { indicatorName: '路线全长（km）', indicatorContent: '', indexNum: 1 },
      { indicatorName: '路基宽度（m）', indicatorContent: '', indexNum: 2 }
        , { indicatorName: '路面宽度（m）', indicatorContent: '', indexNum: 3 },
      { indicatorName: '路面厚度（cm）', indicatorContent: '', indexNum: 4 },
      { indicatorName: '路面结构类型', indicatorContent: '', indexNum: 5 }
        , { indicatorName: '桥梁宽度（m）', indicatorContent: '', indexNum: 6 },
      { indicatorName: '隧道宽度（m）', indicatorContent: '', indexNum: 7 },
      { indicatorName: '设计车速（km/h）', indicatorContent: '', indexNum: 8 },
      { indicatorName: '设计荷载', indicatorContent: '', indexNum: 9 }]
      this.$set(this, 'mainTecTable', arr4)

    },

    getFluctuateNum(val) {
      if (val.budgetEstimate == '') {
        return
      }
      if (val.finalAccounts == '') {
        return
      }

      this.moneyStatusTable[val.indexNum].fluctuateNum = Number(val.finalAccounts) - Number(val.budgetEstimate)
      this.$forceUpdate()
    },


    initData() {
      this.selectList.authorizeList = [
        {
          label: '是',
          value: 1,
        },
        {
          label: '否',
          value: 2,
        },
      ]

      this.selectList.projectType = []
      this.selectList.phaseOptions = []
      this.selectList.gradeType = []
      this.selectList.companyList = []
      this.selectList.projectNature = []
      this.selectList.manageForm = []
      this.selectList.regionOptions = []
      crudDict.getByCode('project_type').then(res => {
        if (res.code === 200) {
          var data = res.data;
          for (var i in data) {
            this.selectList.projectType.push({ 'value': data[i].id, 'label': data[i].name });
          }
        } else {
          msgUtil.error2(res.data.message)
        }
      }).catch(() => {
        msgUtil.error2("获取项目类型失败")
      })

      crudDict.getByCode('phase_type').then(res => {
        if (res.code === 200) {
          var data = res.data;
          for (var i in data) {
            this.selectList.phaseOptions.push({ 'value': data[i].id, 'label': data[i].name });
          }
        } else {
          msgUtil.error2(res.data.message)
        }
      }).catch(() => {
        msgUtil.error2("获取阶段类型失败")
      })

      // crudDict.getByCode('grade_type').then(res => {
      //   if (res.code === 200) {
      //     var data = res.data;
      //     for (var i in data) {
      //       this.selectList.gradeType.push({'value':data[i].id,'label':data[i].name});
      //     }
      //   }else {
      //     msgUtil.error2(res.data.message)
      //   }
      // }).catch(() => {
      //   msgUtil.error2("获取行政等级失败")
      // })

      crudDict.getByCode('project_nature').then(res => {
        if (res.code === 200) {
          var data = res.data;
          for (var i in data) {
            this.selectList.projectNature.push({ 'value': data[i].id, 'label': data[i].name });
          }
        } else {
          msgUtil.error2(res.data.message)
        }
      }).catch(() => {
        msgUtil.error2("获取项目性质失败")
      })

      crudDict.getByCode('manage_form').then(res => {
        if (res.code === 200) {
          var data = res.data;
          for (var i in data) {
            this.selectList.manageForm.push({ 'value': data[i].id, 'label': data[i].name });
          }
        } else {
          msgUtil.error2(res.data.message)
        }
      }).catch(() => {
        msgUtil.error2("获取投资模式失败")
      })

      crudDict.getByCode('companyRegion').then(res => {
        if (res.code === 200) {
          var data = res.data;
          for (var i in data) {
            this.selectList.regionOptions.push({ 'value': data[i].id, 'label': data[i].name });
          }
        } else {
          msgUtil.error2(res.data.message)
        }
      }).catch(() => {
        msgUtil.error2("获取区域失败")
      })


      crudDict.getByCode('project_company').then(res => {
        if (res.code === 200) {
          let designDictId = ''
          //let surveyDictId=''
          let buildDictId = ''
          let supervisorDictId = ''
          let costDictId = ''
          let agentDictId = ''
          let jsDictId = ''

          if (res.data.length > 0) {
            let list = res.data
            list.forEach((item) => {
              if (item.name == '勘察设计单位') {
                designDictId = item.id
              }
              /*if(item.name == '勘察单位'){
                surveyDictId = item.id
              }*/
              if (item.name == '施工单位') {
                buildDictId = item.id
              }
              if (item.name == '监理单位') {
                supervisorDictId = item.id
              }
              if (item.name == '造价咨询') {
                costDictId = item.id
              }
              if (item.name == '代理单位') {
                agentDictId = item.id
              }
              if (item.name == '建设单位') {
                jsDictId = item.id
              }
            })
          }

          this.getCompanyListByType('design', designDictId)
          //新增4个
          this.getCompanyListByType('build', buildDictId)
          this.getCompanyListByType('supervisor', supervisorDictId)
          this.getCompanyListByType('cost', costDictId)
          this.getCompanyListByType('agent', agentDictId)
        } else {
          msgUtil.error2(res.data.message)
        }
      }).catch(() => {
        msgUtil.error2("获取各类型部门失败")
      })


      crudProject.getCompanytList().then(res => {
        if (res.status == 1) {
          this.selectList.companyList = res.data
        } else {
          msgUtil.error2(res.data.message)
        }
      })

      dept.sectorCompany().then(res => {
        if (res.code == 200) {
          this.selectList.sectorCompanyList = res.data
        } else {
          msgUtil.error2(res.data.message)
        }
      })
    },
    getLinkUserOpts(compId) {
      this.linkUserOpts = []
      this.checkedLinkUsers = []
      crudProject.getlinkUsersDept(compId).then(res => {
        if (res.status === 1) {
          let linkUserOpts = res.data;
          this.linkUserOpts = linkUserOpts;
          let ownerRepresentativeUserOpts = res.data;
          this.ownerRepresentativeUserOpts = ownerRepresentativeUserOpts;
          console.log(res.data, '俏丽吗++++++++++++++++++++++++++')
          this.collectDeptUserById(linkUserOpts);
          this.collectDeptUserCompById(ownerRepresentativeUserOpts);
          this.$forceUpdate();
        } else {
          //this.$messageError(res.data.message)
          msgUtil.error2(res.data.message)
        }
      }).catch(res => {
        console.log('请求出现错误', res);
        msgUtil.error2('获取部门用户列表失败!')
      })
    },


    getLinkUserOptss(compId) {
      return crudProject.getlinkUsersDept(compId).then(res => {
        if (res.status === 1) {
          let linkUserOpts = res.data;
          //if(this.detailType != 'edit'){
          this.linkUserOpts = linkUserOpts;
          //}
          let ownerRepresentativeUserOpts = res.data;
          this.ownerRepresentativeUserOpts = ownerRepresentativeUserOpts;
          console.log(res.data, '俏丽吗++++++++++++++++++++++++++')
          this.collectDeptUserById(linkUserOpts);
          this.collectDeptUserCompById(ownerRepresentativeUserOpts);
          return new Promise(reslove => {
            reslove(res)
          })
          this.$forceUpdate();
        } else {
          //this.$messageError(res.data.message)
          msgUtil.error2(res.data.message)
        }
      }).catch(res => {
        console.log('请求出现错误', res);
        msgUtil.error2('获取部门用户列表失败!')
      })
    },


    collectDeptUserById(linkUserOpts) {
      for (let i = 0; i < linkUserOpts.length; i++) {
        let user = linkUserOpts[i]
        let id = user.id
        let children = user.children
        this.linkUsers[id] = user
        if (children && children.length > 0) {
          this.collectDeptUserById(children)
        }
      }
    },

    collectDeptUserCompById(ownerRepresentativeUserOpts) {
      for (let i = 0; i < ownerRepresentativeUserOpts.length; i++) {
        let user = ownerRepresentativeUserOpts[i]
        let id = user.id
        let children = user.children

        this.ownerRepresentativeUsers[id] = user
        if (children && children.length > 0) {
          this.collectDeptUserCompById(children)
        }
      }
    },
    getCompanyListByType(type, dictCode) {
      let param = { type: dictCode }
      dept.getTypeCompanyUsers(param).then(res => {
        if (res.code === 200) {
          let listKey = type + 'List'
          this.selectList[listKey] = res.data
          //----------对buildList的下拉框进行选择显示颜色操作。。。。
          if (listKey === 'buildList') {
            let list = res.data
            if (list) {
              list.forEach((company) => {
                let users = company.children
                if (users) {
                  let map = this.companyMap[type]
                  let companyId = company.id
                  users.forEach((user) => {
                    let userId = user.id
                    map[userId] = companyId
                  })
                }
              })
            }
          } //结束对listKey的判断。。。。.....................
        } else {
          msgUtil.error2(res.data.message)
        }
      })
    },


    manageFormChange() {
      this.$forceUpdate()
    },



    /**
     *  -----@addMulTag="addMulTag"
     * 多选增加--多选模式使用
     * @param val
     */
    addMulTag(val) {
      console.log(val)
      // this.checkedLinkUsers.splice(0, this.checkedLinkUsers.length)
      this.checkedLinkUsers = []
      val.forEach((item) => {
        this.checkedLinkUsers.push(item)
      })
      this.$forceUpdate()
    },
    addMulTag0(val) {
      this.checkedownerRepresentativeUsers.splice(
        0,
        this.checkedownerRepresentativeUsers.length
      )
      val.forEach((item) => {
        this.checkedownerRepresentativeUsers.push(item)
      })
    },
    /**
     * 删除会签部门人
     */
    delTag(val) {
      this.checkedLinkUsers.splice(val, 1)

      this.$forceUpdate()
      this.$refs.cmsPopoverTree.updateTree()
      this.$refs.cmsPopoverTree.$forceUpdate()
    },
    delTag0(val) {
      this.checkedownerRepresentativeUsers.splice(val, 1)
      this.$forceUpdate()
      this.$refs.cmsPopoverTree.updateTree()
      this.$refs.cmsPopoverTree.$forceUpdate()
    },
    /**
     * 增加会签人
     * @param val
     */
    addTag(val) {
      this.checkedLinkUsers.push(val)
      this.$refs.cmsPopoverTree.updateTree()
      this.$refs.cmsPopoverTree.$forceUpdate()
      this.$forceUpdate()
    },

    addTag0(val) {
      this.checkedownerRepresentativeUsers.push(val)
      this.$refs.cmsPopoverTree0.updateTree()
      this.$refs.cmsPopoverTree0.$forceUpdate()
      this.$forceUpdate()
    },


    // 获取列表 api
    getSectionList(reload) {
      if (reload) {
        this.search.pageNo = 0
      }
      this.sectionTable = []
      let postData = {
        projectId: this.detailId,
        pageNo: 0,
        pageSize: 1000,
      }

      crudSection.getTablePage(postData).then(res => {
        if (res.status == 1) {
          if (res.list.length > 0) {
            this.sectionTable = res.list

          }
          this.total = res.total
        } else {
          msgUtil.error2(res.data.message)
        }
      })

    },

    getDetail() {

      crudProject.getOne(this.detailId).then(res => {
        if (res.status == 1) {
          // let formBaseData = this.formBaseData;
          let formBaseData = res.data;

          formBaseData.picture = {
            show: false,
            url: ''
          };
          formBaseData.video = {
            show: false,
            url: ''
          };


          let linkUsers = formBaseData.linkUsers
          this.formBaseData.linkUsers = linkUsers

          this.getLinkUserOptss(formBaseData.constructionUnitId).then(res => {
            if (linkUsers) {
              let linkUserIds = formBaseData.linkUsers.split(',')
              let checkedLinkUsers = []
              for (let i = 0; i < linkUserIds.length; i++) {
                let linkUser = this.linkUsers[linkUserIds[i]]
                if (linkUser) {
                  checkedLinkUsers.push(linkUser)

                }
              }
              this.$set(this, 'checkedLinkUsers', checkedLinkUsers)
              //this.checkedLinkUsers = checkedLinkUsers
            } else {
              this.$set(this, 'checkedLinkUsers', [])
              //this.checkedLinkUsers = []
            }
          })



          this.formBaseData = formBaseData;

          this.formBaseData.phase = formBaseData.phaseId
          this.formBaseData.manageForm = formBaseData.manageFormId
          this.formBaseData.constructionUnit = formBaseData.constructionUnitId
          this.formBaseData.measureType = formBaseData.measureType
          this.formBaseData.isBuildSharesOneList = formBaseData.isBuildSharesOneList
          this.formBaseData.civilMeaReport = formBaseData.civilMeaReport
          this.formBaseData.sectorCompany = formBaseData.sectorCompany


          this.formBaseData.designUnitUsers = formBaseData.designUnitUsers == undefined ? [] : formBaseData.designUnitUsers.split(',')
          console.log("begewgewgwegewgewgwwwwwwwwwwwwww", this.selectList.designList)

          if (formBaseData.projectUnitsList) {
            this.$set(this, 'cjUnitTable', formBaseData.projectUnitsList)
          }
          if (formBaseData.projectTechnicalList) {
            this.$set(this, 'mainTecTable', formBaseData.projectTechnicalList)
          }
          if (formBaseData.projectMainQuantityList) {
            this.$set(this, 'mainProjectSizeTable', formBaseData.projectMainQuantityList)
          }
          if (formBaseData.projectCostSituationList) {
            this.$set(this, 'moneyStatusTable', formBaseData.projectCostSituationList)
          }

          // if(formBaseData.leftBridge){
          //
          //   console.log(formBaseData.leftBridge)
          //   console.log(JSON.parse(formBaseData.leftBridge))
          //   this.leftBridge = JSON.parse(formBaseData.leftBridge)
          //   //this.$set(this,'leftBridge',formBaseData.leftBridge)
          // }


          this.loadFiles()

        } else {
          msgUtil.error2(res.data.message)
        }
      }).catch(() => {
        msgUtil.error2("获取详情信息失败")
      })
    },


    changeDept() {
      this.$forceUpdate()
    },


    //切换分页
    paginationChange(index) {
      this.search.pageNo = index - 1
      this.getList()
    },


    // 提交详情 提交1/暂存0 新建0/修改1
    submitDetail(type, callback) {
      let linkUserIds = []
      let checkedLinkUsers = this.checkedLinkUsers
      for (let i = 0; i < checkedLinkUsers.length; i++) {
        linkUserIds.push(checkedLinkUsers[i].id)
      }
      //默认分标段
      this.biaoInformation = '1'
      //end

      let designUnitUsers = this.formBaseData.designUnitUsers
      if (designUnitUsers) {
        designUnitUsers = designUnitUsers.join(',')
      }

      let surveyUnitUsers = this.formBaseData.surveyUnitUsers
      let owerjsUserIds = []
      let checkOwerjsUserIds = this.checkedownerRepresentativeUsers
      for (let j = 0; j < checkOwerjsUserIds.length; j++) {
        owerjsUserIds.push(checkOwerjsUserIds[j].id)
      }
      if (surveyUnitUsers) {
        surveyUnitUsers = surveyUnitUsers.join(',')
      }
      //
      //当选择不分标段时，获取所有的值。。。。。。。。
      let buildUnitUsers = this.formBaseDataBiao.buildUnitUsers
      if (buildUnitUsers) {
        buildUnitUsers = buildUnitUsers.join(',')
      }

      let supervisorUnitUsers = this.formBaseDataBiao.supervisorUnitUsers
      if (supervisorUnitUsers) {
        supervisorUnitUsers = supervisorUnitUsers.join(',')
      }
      let costUnitUsers = this.formBaseDataBiao.costUnitUsers
      if (costUnitUsers) {
        costUnitUsers = costUnitUsers.join(',')
      }

      let agentConstructionUsers = this.formBaseDataBiao.agentConstructionUsers
      if (agentConstructionUsers) {
        agentConstructionUsers = agentConstructionUsers.join(',')
      }
      //在这里定义一个状态，使外部单位没有任何一个被选中时，也不用执行任何新增或者更改操作
      let stateBiao = true

      if (supervisorUnitUsers === '') {
        this.formBaseDataBiao.supervisorUnit = ''
      }
      if (buildUnitUsers === '') {
        this.formBaseDataBiao.buildUnit = ''
      }
      if (
        agentConstructionUsers === '' &&
        costUnitUsers === '' &&
        supervisorUnitUsers === '' &&
        buildUnitUsers === ''
      ) {
        stateBiao = false
      }


      let idsString = ''
      this.chooseProjectTypeArr.forEach((item, index) => {
        if (item.id) {
          if (index == 0) {
            idsString = item.id + '&' + item.name
          } else {
            idsString = idsString + ',' + item.id + '&' + item.name
          }
        }
      })
      let designComArr = []
      let surveyComArr = []

      // let leftarr  = JSON.parse(JSON.stringify(this.leftBridge))
      let param = {
        sectorCompany: this.formBaseData.sectorCompany,
        proName: this.formBaseData.proName,
        code: this.formBaseData.code,
        id: this.detailId,
        unitCode: this.formBaseData.unitCode,
        shortName: this.formBaseData.shortName,
        projectType: this.formBaseData.projectType,
        manageForm: this.formBaseData.manageForm,
        phase: this.formBaseData.phase,
        constructionUnit: this.formBaseData.constructionUnit,
        ownerRepresentative: owerjsUserIds.join(','),
        startTime: this.formBaseData.startTime,
        endTime: this.formBaseData.endTime,
        //
        startPlanTime: this.formBaseData.startPlanTime,
        endPalnTime: this.formBaseData.endPalnTime,
        projectMeaning: this.formBaseData.projectMeaning,
        biaoInformation: this.biaoInformation,
        properties: this.formBaseData.properties,
        amount: this.formBaseData.amount,
        region: this.formBaseData.regionIdList,
        projectLocation: this.formBaseData.projectLocation,
        projectSurvey: this.formBaseData.projectSurvey,
        designUnitUsers: designUnitUsers,
        designCom: designComArr.join(','),
        surveyCom: surveyComArr.join(','),
        surveyUnitUsers: surveyUnitUsers,
        linkUsers: linkUserIds.join(','),
        gradeType: this.formBaseData.gradeType,
        projectNature: this.formBaseData.projectNature,
        needCharge: this.formBaseData.needCharge,
        lineNum: this.formBaseData.lineNum,
        projectFirstLetter: this.formBaseData.projectFirstLetter,
        buildScale: this.formBaseData.buildScale,
        buildMode: this.formBaseData.buildMode,
        fundsSource: this.formBaseData.fundsSource,
        // hugeBridgeLong: this.formBaseData.hugeBridgeLong,
        // hugeBridgeNum: this.formBaseData.hugeBridgeNum,
        // bigBridgeLong: this.formBaseData.bigBridgeLong,
        // bigBridgeNum: this.formBaseData.bigBridgeNum,
        // shortBridgeLong: this.formBaseData.shortBridgeLong,
        // shortBridgeNum: this.formBaseData.shortBridgeNum,
        // hugeTunnelLong: this.formBaseData.hugeTunnelLong,
        // hugeTunnelNum: this.formBaseData.hugeTunnelNum,
        // longTunnelLong: this.formBaseData.longTunnelLong,
        // longTunnelNum: this.formBaseData.longTunnelNum,
        // shortTunnelLong: this.formBaseData.shortTunnelLong,
        // shortTunnelNum: this.formBaseData.shortTunnelNum,
        measureType: this.formBaseData.measureType,
        isBuildSharesOneList: this.formBaseData.isBuildSharesOneList,
        civilMeaReport: this.formBaseData.civilMeaReport,
        projectUnitsList: this.cjUnitTable,
        projectMainQuantityList: this.mainProjectSizeTable,
        projectCostSituationList: this.moneyStatusTable,
        projectTechnicalList: this.mainTecTable,

        // leftBridge: JSON.stringify(leftarr)
      }
      if (this.detailType === 'build') {
        crudProject.submit(param).then(res => {
          if (res.status === 1) {
            this.detailId = res.data.id
            this.saveFiles()
            // 传值给父组件刷新列表
            this.$notify({
              title: '保存成功',
              type: 'success',
              duration: 1500
            })
            this.$emit('reloadList')
            this.formShow = false
          } else {
            msgUtil.error2(res.data.message)
          }
        }).catch((response) => {
          this.$notify({
            title: '数据新增失败',
            type: 'error',
            duration: 2500
          })
        }).finally((response) => {
          callback && callback();
          // this.isLoading = false
        })
      } else {
        crudProject.resubmit(param).then(res => {
          if (res.status === 1) {
            if (type == 'needResubmit') {
              return
            }
            this.detailId = res.data.id
            this.saveFiles()
            // 传值给父组件刷新列表
            this.$notify({
              title: '保存成功',
              type: 'success',
              duration: 1500
            })
            this.$emit('reloadList')
            this.formShow = false
          } else {
            msgUtil.error2(res.data.message)
          }
        }).catch((response) => {
          this.$notify({
            title: '数据新增失败',
            type: 'error',
            duration: 2500
          })
        }).finally((response) => {
          callback && callback();
          // this.isLoading = false
        })
      }
    },

    // 事件处理的api请求
    sealDealHttp(url, query, params, callback) {
      this.$httpPost(this.$store.state.httpHost.buss + url + query, params)
        .then((res) => {
          if (res.data.status === 1) {
            if (callback) callback(res.data)
          } else {
            this.$messageError(res.data.message)
          }
        })
        .catch((res) => {
          console.log('请求出现错误', res)
          console.log(res)
        })
    },
    // 点击各个流程的按钮事件
    handleClickDeal(type, res, callback) {
      switch (type) {
        // 取消，关闭窗口
        case 'cancel':
          // 重置表单验证
          if (this.activeName == 'first') {
            if (this.$refs['formBaseData'] !== undefined) {
              this.$refs['formBaseData'].resetFields()
            }
          }
          this.cjUnitTable = []
          this.mainProjectSizeTable = []
          this.moneyStatusTable = []
          this.mainTecTable = []
          this.chooseLeftIndex = 0
          // 清空表单内容
          this.formBaseData = {
            measureType: '',
            isBuildSharesOneList: '',
            civilMeaReport: '',
            sectorCompany: '',
            manageForm: '',
            proName: '',
            code: '',
            unitCode: '',
            shortName: '',
            projectType: '',
            phase: '',
            constructionUnit: '',
            ownerRepresentative: '',
            startTime: '',
            endTime: '',
            //start
            startPlanTime: '',
            endPalnTime: '',
            projectMeaning: '',
            biaoInformation: '',
            buildCom: '',
            supervisorCom: '',
            costCom: '',
            properties: '',
            agentConstructionCom: '',
            //end
            amount: '',
            region: '',
            projectLocation: '',
            projectSurvey: '',
            picture: {
              show: false,
              url: '',
            },

            hugeBridgeLong: '',
            hugeBridgeNum: '',
            bigBridgeLong: '',
            bigBridgeNum: '',
            shortBridgeLong: '',
            shortBridgeNum: '',
            hugeTunnelLong: '',
            hugeTunnelNum: '',
            longTunnelLong: '',
            longTunnelNum: '',
            shortTunnelLong: '',
            shortTunnelNum: '',
            buildScale: '',
            buildMode: '',
            fundsSource: '',
            projectFirstLetter: '',
            //
            /* companyMap: {
               build: {},
               cost: {},
               supervisor: {},
               agent: {},
             },*/
            formBaseDataBiao: {
              code: '',
              coveredArea: '',
              projectSite: '',
              structureType: '',
              startTime: '',
              endTime: '',
              buildUnitUsers: [],
              supervisorUnitUsers: [],
              costUnitUsers: [],
              agentConstructionUsers: [],
              properties: '',
              intro: '',
              //新增兩個
              buildUnit: '',
              supervisorUnit: '',
              //end
              // manufacturingCost:'',
              sectionLength: '',
            }, // 表单基本信息内容
            //end
            video: {
              show: false,
              url: '',
            },
            regionIdList: [],
          } // 表单基本信息内容
          this.chooseIndex = 0
          this.leftBridge = []
          this.fileList = []
          for (let k in this.fileSystem) {
            let fileProp = this.fileSystem[k]
            this.$refs[fileProp.compoName].cancelAll()
          }
          // 关闭弹窗
          this.formShow = false
          //
          this.tenders = false
          this.tendersFen = false
          this.selectList.manageFormList = []
          this.selectList.sectorCompanyList = []
          this.selectList.authorizeList = []
          //this.detailId=''
          //关闭窗口显示待确定
          //start,,,,,,当关闭窗口时，对每条数据进行去除disabled特性
          this.selectList.buildList.forEach((company) => {
            //去除施工单位的disabaled属性
            company.disabled = false
            let children = company.children
            if (children) {
              children.forEach((child) => {
                child.disabled = false
              })
            }
          })
          this.selectList.costList.forEach((company) => {
            //去除施工单位的disabaled属性

            company.disabled = false
            let children = company.children
            if (children) {
              children.forEach((child) => {
                child.disabled = false
              })
            }
          })
          //end
          // document.getElementsByName('radios')[0].checked = 'checked'
          //使其变量置为空值。以免变量生命周期的影响。。。
          this.tendersTotal = ''
          //end
          break
        // 保存
        case 'submit':
          // 表单验证
          this.$nextTick(() => {
            this.$refs['formBaseData'].validate((valid) => {
              if (valid) {
                let flag = res.flag
                let hasName = true
                for (let i in this.leftBridge) {
                  if (!this.leftBridge[i].name) {
                    hasName = false
                  }
                }
                if (!hasName) {
                  this.$messageWarning('请填写桥梁/隧道名称')
                  callback && callback();
                  return
                }
                // 再验证其他内容
                // 整理文件信息
                // this.isLoading = true
                // 提交详情
                this.submitDetail(flag, () => {
                  callback && callback();
                })
              } else {
                callback && callback();
                // this.isLoading = false
              }
            })
          })

          break
        // 删除
      }
    },
    saveFiles() {
      for (let k in this.fileSystem) {
        let fileProp = this.fileSystem[k]
        this.$refs[fileProp.compoName].saveAll(this.detailId)
      }
    },

    loadFiles() {
      this.$nextTick(() => {
        for (let k in this.fileSystem) {
          let fileProp = this.fileSystem[k]
          console.log("fileProp=", fileProp.compoName)
          this.$refs[fileProp.compoName].init()
        }
      })
    },


    handleClick(tab, event) {
      console.log(tab, event)
    },

    getRadioVal2() {
      this.tenders = false
      this.tendersFen = true
    },
    getRadioVal1() {
      this.tenders = false
      this.tendersFen = false
    },

  },
}
</script>

<style scoped lang="scss">
$borderColor: #c0c4cc;

.popContainer {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0, 0, 0, 0.3);
}

.video-remove {
  position: absolute;
  top: 40%;
  z-index: 999;
  cursor: pointer;
}

.contract-ele {
  //   width: 280px;
  width: 95%;
}

.contract-ele-long {
  //   width: 280px;
  width: 98%;
}

.formTitle {
  font-weight: bold;
  font-size: 16px;
}

.hoverTxt {
  color: #008fe0;
  cursor: pointer;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.upload-demo-fujian {
  width: 250px;
}

.upload-demo-zongtu {
  width: 300px;
}
.flex-row {
  display: flex;
  flex-direction: row;
  align-items: center;
}
.left-choose-div {
  border: 1px solid #e3e3e3;
  width: 14%;
  min-width: 150px;
  padding: 0 15px 0 15px;
}
.blueText {
  color: #0baaf6;
}
.left-p {
  cursor: pointer;
}
.right-table {
  flex-grow: 1;
}
.flex-row-info {
  display: flex;
  flex-direction: row;
  width: 100%;
}
.info-detail-box {
  border: 1px $borderColor solid;
  display: flex;
  flex-direction: row;
  margin: 30px 0;
  .left-box {
    min-width: 200px;
    padding: 0 0 15px 0;
    padding-bottom: 50px;
    border-right: 1px $borderColor solid;
    position: relative;
    .left-content-box {
      padding: 15px;
      max-height: 350px;
      overflow-y: auto;
    }
    p {
      cursor: pointer;
    }
  }
  .right-box {
    flex-grow: 1;
    padding: 15px;
    padding-bottom: 30px;
  }
  .chooseText {
    color: #008fe0;
  }
}
.flex-row-bridge {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  p {
    margin: 5px 0;
    max-width: 150px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  i {
    cursor: pointer;
  }
  i:hover {
    color: #a71c1c;
  }
}
.left-bottom-group {
  width: 100%;
  display: flex;
  align-items: center;
  flex-direction: row;
  justify-content: space-around;
  position: absolute;
  bottom: 10px;
  left: 0;
  .el-button {
  }
  .deleteBatch {
    background-color: rgba(215, 215, 215, 0);
    border-color: #409eff;
    color: #409eff;
  }
}
.fileText {
  cursor: pointer;
  margin: 0;
  padding-left: 10px;
  display: flex;
  align-items: center;
  img {
    height: 20px;
    margin-right: 15px;
  }
  span {
    width: 40%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    word-break: keep-all;
    margin-right: 15px;
  }
}
.fileText:hover {
  background-color: rgb(245, 247, 250);
}
.flex-hv-center {
  min-height: 100px;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}
.upload-text-style {
  i {
    font-size: 12px;
  }
}
</style>
<style lang="scss">
.form-center {
  display: flex;
  align-items: center;
  .el-form-item__content {
    display: flex;
    align-items: center;
    margin-left: unset !important;
  }
}
</style>
